{% extends "base.html" %}
{% block page %}
    <div style="float: right;margin-right: 3.5%">
        <form action="/chart_domain_status" method="post" style="margin:0px">
            {{ form.csrf_token }}
            <div style="display: inline">
                {{ form.input (id='input',style="width:120px;Float:left;margin-top: 4%",placeholder="选择时间点") }}
                {{ form.submit(class="btn btn-link", value='查询',style="Float:left") }}
            </div>
        </form>
    </div>
    <div style="clear:both"><hr style="float:right;width: 10%;margin: 0px;margin-right: 4%;background-color:lightsalmon;height:1px;border:none;"></div>
    <div style="width: 99%">
        {% if bar_upstreams %}
            {% for bar in bar_upstreams %}
                <div style="width:47%;float:left;border:1px solid gainsboro;overflow: hidden;height: 350px;margin-top: 1%;margin-left: 1%;margin-right: 1%">
                    {{ echarts_js_dependencies(bar) }}
                    {{ echarts_container(bar) }}
                    {{ echarts_js_content(bar) }}
                </div>
            {% endfor %}
            <div style="clear:both"></div>
        {% endif %}
    </div>
    <script type="text/javascript">
        document.getElementById("input").flatpickr({locale: "zh",minDate:'today',maxDate:'today',enableTime: true, dateFormat: "Y-m-d H:i", time_24hr: true,minuteIncrement:1});
    </script>
{% endblock page %}
